<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <title>WebSFTP</title>
    <!--Open Sans Font-->
    <link href='https://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700' rel='stylesheet' type='text/css'>
    <!--elfinder-->
    <link rel="stylesheet" type="text/css" media="screen" href="{{ url_for('static', filename='plugins/elfinder/css/elfinder.min.css') }}">
    <link rel="stylesheet" type="text/css" media="screen" href="{{ url_for('static', filename='plugins/elfinder/css/theme-gray.css') }}">

    <style>
        body {
            padding: 0;
            margin: 0;
        }
    </style>

</head>
<body>
    <div id="elfinder"></div>
</body>

<!--引入JavaScript-->
<!--jQuery [ REQUIRED ]-->
<script src="{{ url_for('static', filename='js/jquery-1.12.4.js') }}"></script>
<!--jQuery-UI-->
<script type="text/javascript" src="{{ url_for('static', filename='js/jquery-ui.min.js') }}"></script>
<!--socket-io-->
<script type="text/javascript" src="{{ url_for('static', filename='js/socket.io.js') }}"></script>
<!--elfinder-->
<script type="text/javascript" src="{{ url_for('static', filename='plugins/elfinder/elfinder.full.js') }}"></script>
<script type="text/javascript" src="{{ url_for('static', filename='plugins/elfinder/i18n/elfinder.pl.js') }}"></script>


<script type="text/javascript" charset="utf-8">
    var socket = io.connect('/sftp');
    socket.on('connect', function () {
        console.log("Connect websocket done")
    });
    socket.on('data', function (msg) {
        var sid = msg.sid;
        init_elfinder(sid);
    });
    function init_elfinder(sid) {
        var elf;
        var opts = {
            uiOptions : {
                toolbar: [
                    ['back', 'forward'],
                    ['mkdir', 'mkfile'],
                    ['copy', 'cut', 'paste'],
                    ['rm'],
                    ['rename'],
                    ['view']
                ],
                cwd : {oldSchool: true}
            },
            customData: {'sid': sid},
            width: '100%',
            url: '{{ url_for("terminal.api-sftp-connector", host=host) }}',
            resizable: false,
            lang: 'pl',
            requestType: 'get',
            contextmenu: {
                navbar: [
                    'rm'
                ],
                cwd: [
                    'reload', 'back', 'up', '|', 'mkdir', 'mkfile', '|',
                    'upload', 'paste'
                ],
                files: [
                    'rm', 'rename', 'download', 'copy', 'cut', 'paste'
                ]
            },
            rememberLastDir: false,
            placesFirst: false,
            reloadClearHistory: true
        };
        var start = function(lng) {
            $(function() {
                // Make elFinder (REQUIRED)
                opts.lang = lng;
                elf = $('#elfinder').elfinder(opts).elfinder('instance');
                $(window).trigger('resize');
            });
        };
        var load = function () {
            var loct = window.location.search;
            var full_lng, locm, lng;
            if (loct && (locm = loct.match(/lang=([a-zA-Z_-]+)/))) {
                full_lng = locm[1];
            } else {
                full_lng = (navigator.browserLanguage || navigator.language || navigator.userLanguage);
            }
            lng = full_lng.substr(0,2);
            if (lng === 'ja') {
                lng = 'jp';
            }
            else if (lng === 'pt') {
                lng = 'pt_BR';
            }
            else if (lng === 'zh') {
                lng = (full_lng.substr(0,5) == 'zh-tw')? 'zh_TW' : 'zh_CN';
            }
            if (lng !== 'en') {
                $.ajax({
                    url : "{{ url_for('static', filename='plugins/elfinder/i18n/') }}"+'/elfinder.'+lng+'.js',
                    cache : true,
                    dataType : 'script'
                })
                .done(function() {
                    start(lng);
                })
                .fail(function() {
                    start('en');
                });
           } else {
                start(lng);
           }
        };
        load();
        var resizeTimer;
        $(window).resize(function () {
            resizeTimer && clearTimeout(resizeTimer);
            if (!$('#elfinder').hasClass('elfinder-fullscreen')) {
                resizeTimer = setTimeout(function () {
                    var h, w;
                    if (window !== parent) {
                        h = parseInt(parent.$('.window.active').height());
                        w = parseInt(parent.$('.window.active').width());
                    } else {
                        h = parseInt($(window).height());
                        w = parseInt($(window).width());
                    }
                    var ori_h = parseInt($('#elfinder').height());
                    var ori_w = parseInt($('#elfinder').width());
                    if (h !== ori_h || w !== ori_w){
                        elf.resize(w, h);
                    }
                }, 200);
            }
        });
    }
</script>

</html>



